<script setup>
import ServiceContent from '@/components/service-content';
import ServiceProgress from '@/components/service-progress';
import { HomeTab, homeTabText } from '@/const';

const tab = ref(HomeTab.content);
function tabChange(val) {
  console.log(val, 'val====111');
}
</script>

<template>
  <view>
    <ServiceContent v-if="tab === HomeTab.content" />
    <ServiceProgress v-else />

    <nut-tabbar v-model="tab" bottom safe-area-inset-bottom @tab-switch="tabChange">
      <nut-tabbar-item :tab-title="homeTabText[HomeTab.content]" :name="HomeTab.content" />
      <nut-tabbar-item :tab-title="homeTabText[HomeTab.progress]" :name="HomeTab.progress" />
    </nut-tabbar>
  </view>
</template>

<style lang="scss">
.service-content {
  height: calc(100vh - 330rpx);
}
</style>

<route type="home" lang="json">
{
  "layout": "home"
}
</route>
